《有声有色的个人主页》的制作方法
【实例说明】:
本例制作一个有声有色的个人主页的效果。具体效果为打开网页后,有漂亮的鼠标跟随动画,同时伴有美妙的音乐。单击相应按钮或文字后即可打开相应的网站。同时为本主页配备了一个极酷的密码登录框;
本主页的教程编写时,只是把教学的重点放在按钮及文字的URL链接语言编写,这主要是为了降低初学时的难度。主页的制作也尽量使用简单的线条,除了有降低维度外,还有另外一层考虑,为了增加在网络上传播的流畅性。对于其中的难点,本书中会有善意的提示,你可以进一步参照相应部分学习。
【操作步骤】:
〖一〗、新建文档
- 单击“文件”/“新建”命令,创建一个新文档;
- 单击“修改”/“文档”命令;在“文档属性”对话框中设置“尺寸”为800×600,背景色为黑色;单击“确定”按钮。
- 双击“图层1”,将其命名为“背景层”;
- 利用Adobe Photoshop 软件制作一幅图片,如下图所示(如果不会制作,那就找一幅你觉得漂亮的图片也可以):
- 然后在flash8.0中,执行“文件/导入/库”命令,将该图片导入到库中;最后再将其放到舞台上。
- 再新建一个“图层2”;将其命名为“内容层”;对照下图绘制如下文字或按(下图为了清晰,已经去掉了上面的背景图片,实例制作中你却需要在上面的图片上进行哦)。
提示:如果绘制不好上面的图形,就只输入好上面的文字就可以了,
实际效果如下图:
〖二〗制作文字按钮:
- 选中上图中的“首页”文字;按F8键打开“转换为元件”对话框;名称中输入“首页”,单击“按钮”单选项;单击“确定”按钮;双击该按钮进入其编辑区;选中“指针经过”帧,按F6键插入“关键帧”;再选中“点击”帧,按F5键插入“帧”;再选中“指针经过”帧中的“首页”文本;单击工具栏中的填充色按钮,在弹出的色块框中选中一种不同的颜色,也就是改变一下该帧中“首页”文字的颜色。这样就将“首页”文本转换成了一个会变颜色的文字按钮了。
- 对照上面的方法,再分别选中“作品区”、“上传区”、“闪客榜”三个文本,将它们转换成三个按钮元件。
〖三〗制作影片剪辑元件:
- 选中“闪客俱乐部”文本;按F8键将其转换为一个“影片剪辑”元件;
- 双击该元件进入其编辑区;分别选中第5、10、15帧,按F6键插入“关键帧”;然后分别选中第5、10、15帧中的文本,将它们的改变成不同的颜色;然后单击“场景1”按钮返回到主场景的舞台中;
〖四〗鼠标跟随动画的制作:
- 新建一个新图层;取名为“鼠标跟随层”;
- 鼠标跟随动画的制作具体详见本书中的“旋转的花朵”的制作方法篇;(或打开光盘中的旋转的花朵源文件从中直接提取那一个影片剪辑元件粘贴到本舞台上即可)
〖五〗密码登录框的制作:
- 新建一个新图层;取名为“登录层”;
- 密码登录框的制作具体详见本书中的“登录界面”的制作方法篇;(或打开光盘中的登录界面源文件从中直接提取语言及元件粘贴到本舞台上即可)
〖六〗添加语言代码:
- 确认选中“首页”按钮元件;打开动作面板,为其输入以下代码:
on (release) {
getURL("http://luotao12.xinwen365.com", "_blank");
}
- 确认选中“作品区”按钮元件;打开动作面板,为其输入以下代码:
on (release) {
getURL("http://luotao12.xinwen365.com", "_blank");
}
- 确认选中“上传区”按钮元件;打开动作面板,为其输入以下代码:
on (release) {
getURL("http://luotao12.xinwen365.com", "_blank");
}
- 确认选中“闪客榜”按钮元件;打开动作面板,为其输入以下代码:
on (release) {
getURL("http://luotao12.xinwen365.com", "_blank");
}
说明:以上代码中的网址http://luotao12.xinwen365.com在实际制作中,可根据不同按钮的不同的网址进行输入。
- 选中文本“个人简介”,打开属性面板,在链接栏为其输入以下代码:
http://luotao12.xinwen365.com
- 选中文本“生活画册”,打开属性面板,在链接栏为其输入以下代码:
http://luotao12.xinwen365.com
- 选中文本“跟你谈谈话”,打开属性面板,在链接栏为其输入以下代码:
http://luotao12.xinwen365.com
- 选中文本“陪你听听歌”,打开属性面板,在链接栏为其输入以下代码:
http://luotao12.xinwen365.com
说明:上面的网址同样你根据不同的网址进行输入。
如果你不清楚属性面板中的链接栏的位置,请参看下图:
〖七〗添加背景音乐:
- 新建一个图层;命名为“音乐层”;
- 单击“文件/导入/导入到库”命令;在“导入到库”对话框中选择一首mp3音乐导入到舞台;
- 选中“音乐层”的第1帧;从库中将该音乐拖放到舞台上;然后再选中第1帧;打开属性面板;在“同步”后面选择“开始”项;并且再选中后面的“循环”项;
- 好了OK了。
- 最后在保存该文件的位置找到“有声有色的个人主页.html”文件;双击打开它就可以看到该主页了;
- 哦,对了,你如果想把该网页上传到互联网上动怎么办?很简单,按以下步骤进行操作就可以了。
- 第-步,打开“有声有色的个人主页.fla”源文件;第二步,单击“文件”;单击“另存为”命令;文件名后面输入“index”;第三步,按键盘上的F12键发布成网页;第四步,在保存文件的位置,找到以下几个文件(“index.html”和“index. swf”),将这两个文件上传到互联网上就可以了。
- 最终效果如下图:
〖八〗、最后按“Ctrl+Enter”组合键测试影片
|